{if !$isLoadScript}
	<link type="text/css" rel="stylesheet" href="__STATIC__/webuploader/css/webuploader.css">
	<script type="text/javascript" charset="utf-8" src="__STATIC__/webuploader/js/webuploader.js"></script>
{/if}
<div class="controls multiImage">
    <div id="uploader_{$id}" style="padding-bottom: 5px;">{:lang("select pictures")}</div><!-- 上传按钮 -->
    <input type="hidden" name="{$id}" value="{$value}" id="image_upload_{$id}" class="attach" /><!-- 隐藏域 -->
    <div id="file_list_{$id}"><!-- 文件列表 -->
	    {notempty name="pictures"}
            {volist name="pictures" id="vo"}
                <div style="width: 100px; position: relative; display: inline-block;">
					<image src="/uploads/{$vo.path}" width="100" height="100"/>
					<a onclick="del_image_{$id}(this, {$vo.id})" style="position: absolute; top: 5px; right: 5px;"><i class="icon-trash"></i></a>
				</div>
            {/volist}
        {/notempty}
    </div>
</div>
<script>
    $(function(){
        var id = "#uploader_{$id}";
        var $list_{$id} = $('#file_list_{$id}');
        // var limit = parseInt('{$limit??0}');
        var uploader_{$id} = WebUploader.create({
            auto: true,
            swf: '__STATIC__/webuploader/js/Uploader.swf',
            server: '{:url("core/File/uploadPicture")}',
            pick: {'id': id, 'multi': true},
            // fileNumLimit: limit,
            accept: {
                title: 'Images',
                extensions: 'gif,jpg,jpeg,bmp,png',
                mimeTypes: 'image/*'
            }
        });

        uploader_{$id}.on('fileQueued', function(file) {
	        uploader_{$id}.upload();

			toast.showLoading(); // toast
	    });
        uploader_{$id}.on('uploadSuccess', function(file, ret) {
            if ( ret.status==1 ) {
				toast.success("{:lang('upload success')}"); // toast

				$list_{$id}.append('<div style="width: 100px; position: relative; display: inline-block;"><image src="'+ret.data.file.url+'" width="100" height="100" /><a onclick="remove_file_{$id}'+'(this,'+ret.data.file.id+')" style="position: absolute; top: 5px; right: 5px;"><i class="icon-trash"></i></a></div>');
				upAttachVal($('#image_upload_{$id}'), 'add', ret.data.file.id);
			} else { // 上传失败
				toast.error("{:lang('upload fail')}"+ret.info); // toast
			}
        });
        uploader_{$id}.on('uploadError', function(file) {
           toast.error("{:lang('upload fail')}");
        });
        uploader_{$id}.on('uploadComplete', function(file) {
            toast.hideLoading(); // toast
        });
    });
    function upAttachVal(input, type, attachId) {
        var $attach_ids = input;
        var attachVal = $attach_ids.val();
        var attachArr = attachVal.split(',');
        var newArr = [];

        for ( var i in attachArr ) {
            if ( attachArr[i] !== '' && attachArr[i] !== attachId.toString() ) newArr.push(attachArr[i]);
        }
        type === 'add' && newArr.push(attachId);
        $attach_ids.val(newArr.join(','));
    }
    function del_image_{$id}(obj, attachId) {
        upAttachVal($('#image_upload_{$id}'), 'del', attachId);
        $(obj).parent('div').remove();
    }
</script>